<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

<head>
    <title>add Emp</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/ems/css/style.css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath }/ems/js/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath }/ems/js/datepricker/WdatePicker.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath }/ems/js/time.js"></script>
    <script>
        $(function () {

            //创建日期插件
            $(".Wdate").click(function () {
                WdatePicker();
            });

        });
    </script>
</head>

<body>
<div id="wrap">
    <div id="top_content">
        <div id="header">
            <div id="rightheader">
                <p>
                    <span id="time"></span>
                    <script type="text/javascript">
                        showtime();
                    </script>
                    <br/>
                </p>
            </div>
            <div id="topheader">
                <h1 id="title">
                    <a href="#">Main</a>
                </h1>
            </div>
            <div id="navigation">
            </div>
        </div>
        <div id="content">
            <p id="whereami">
            </p>
            <h1>
                add Emp info:
            </h1>
            <form action="${pageContext.request.contextPath}/emp/add" method="post">
                <table cellpadding="0" cellspacing="0" border="0"
                       class="form_table">
                    <tr>
                        <td valign="middle" align="right">
                            name:
                        </td>
                        <td valign="middle" align="left">
                            <input type="text" class="inputgri" name="name"/>
                        </td>
                    </tr>
                    <tr>
                        <td valign="middle" align="right">
                            salary:
                        </td>
                        <td valign="middle" align="left">
                            <input type="text" class="inputgri" name="salary"/>
                        </td>
                    </tr>
                    <tr>
                        <td valign="middle" align="right">
                            age:
                        </td>
                        <td valign="middle" align="left">
                            <input type="text" class="inputgri" name="age"/>
                        </td>
                    </tr>
                    <tr>
                        <td valign="middle" align="right">
                            birthday:
                        </td>
                        <td valign="middle" align="left">
                            <input type="text" class="Wdate" name="birthday" readonly="readonly"/>
                        </td>
                    </tr>
                    <tr>
                        <td valign="middle" align="right">
                            所属部门:
                        </td>
                        <td valign="middle" align="left">

                            <select onclick="getDept()" name="deptId" id="dept">
                                <option disabled selected>请选择部门</option>
                            </select>


                    </tr>
                </table>
                <p>
                    <input type="submit" class="button" value="Confirm"/>
                </p>
            </form>
        </div>
    </div>
    <div id="footer">
        <div id="footer_bg">
            ABC@126.com
        </div>
    </div>
</div>
</body>
<script>
    var count = 0;

    function getDept() {

        if (count == 0) {
            $.ajax({
                method: "get",//ajax请求的方式  方法
                url: "http://localhost:8080/ems/dept/all",//请求的地址
                data: {},//请求的数据"name=hongtao&age=18"   {"name":"王渊","age":18}
                /*dataType:"json",*/
                success: function (data) {
                    //alert(data);
                    //将json数据转换
                    var jsonData = JSON.parse(data);
                    console.log(jsonData )


                    var htmls;

                    for (var i = 0; i < jsonData.length; i++) {
                        htmls = "<option value=" + jsonData[i].id + ">" + jsonData[i].name + "</option>";
                        $("#dept").append(htmls)
                    }


                    count++;

                },
                error: function (data) {
                    alert(data.toString())
                }

            })
        }
    }
</script>
</html>
